<template>
  <ul class="ivr-ul">
    <time-line v-show="ivrData" v-for="(item, index) in ivrData" :key="item._id">
      <span class="date">{{item.TIMESTAMP}}</span>
      <span class="node-type" v-if="item.LOCATION_NAME === 'Ringing' || item.LOCATION_NAME === 'Link'">
        {{$t('public.agent')}}:
        <span v-if ='item.LOCATION_USER_NAME' v-text="item.LOCATION_USER_NAME"></span>
        <agent v-else ='item.LOCATION_ID':id="item.LOCATION_ID" :isNum="true"></agent>
      </span>
      <!-- <span class="node-type" v-else-if='item.LOCATION === "agent_hangup" && item.CHANNELTYPE === "transfer"'>{{locationName('hangup')}}</span> -->
      <span class="node-type" v-else-if='item.LOCATION === "agent_hangup"'>
        {{$t('public.agent')}}:
        <span v-if ='item.LOCATION_USER_NAME' v-text="item.LOCATION_USER_NAME"></span>
        <agent v-else ='item.LOCATION_ID':id="item.LOCATION_ID" :isNum="true"></agent>
      </span>
       <span class = 'node-type' v-else-if="item.LOCATION_NAME=== 'Ringing' && item.CHANNELTYPE === 'transfer'">
         {{$t('public.agent')}}:
        <span v-if ='item.LOCATION_USER_NAME' v-text="item.LOCATION_USER_NAME"></span>
        <agent v-else ='item.LOCATION_ID':id="item.LOCATION_ID" :isNum="true"></agent>
       </span>
      <span class="node-type" v-else>{{locationName(item.LOCATION)}}</span>
      <span v-if="item.LOCATION=== 'QUEUE'"><queues :id="item.LOCATION_ID"></queues></span>
      <span v-else-if="item.LOCATION_NAME=== 'Ringing' && item.CHANNELTYPE === 'transfer'">{{$t('call.callTransfer')}}</span>
      <span v-else-if="item.LOCATION=== 'agent_hangup' && item.CHANNELTYPE !== 'transfer'">{{getAgentHangupText(item)}}</span>
      <span v-else-if='item.LOCATION === "agent_hangup" && item.CHANNELTYPE === "transfer"'>{{getHangupText(item)}}</span>
      <span v-else-if="item.LOCATION=== 'hangup'">{{getHangupText(item)}}</span>
      <span v-else>{{locationName(item.LOCATION_NAME)}}
      </span>
    </time-line>
  </ul>
</template>
<script>
  // 此组件是ivr轨迹
  import TimeLine from '@/components/ui-modules/timeLine/TimeLine'
  import Agent from '@/components/public-modules/cache/Agent'
  import Queues from '@/components/public-modules/cache/Queues'
  import { getChannelLocationName } from '@/utils/m7Utils.js'
  export default {
    name: 'Contrail',
    data () {
      return {
      }
    },
    props: {
      ivrData: Array
    },
    components: {
      TimeLine,
      Agent,
      Queues
    },
    beforeMount () {
    },
    methods: {
      locationName (name) {
        return getChannelLocationName(name)
      },
      getAgentHangupText (item) {
        const type = item.HANGUP_CAUSE
        if (type === '16') {
          if (item.LINK === 1) {
            return this.$t('softPhoneBar.hangup')
          } else {
            return this.$t('call.agent_hangup_type1')
          }
        } else if (type === '21') {
          return this.$t('call.agent_hangup_type2')
        } else if (type === '17') {
          return this.$t('call.agent_hangup_type3')
        } else if (type === '19'){
           return this.$t('call.agent_hangup_type5')
        } else {
          return this.$t('call.agent_hangup_type4')
        }
      },
      getHangupText (data) {
        if (data.HANGUP_USER && data.HANGUP_USER !== '') {
          if (data.HANGUP_USER === 'transfer') {
            if (data.HANGUP_CAUSE) {
              if (data.HANGUP_CAUSE === '2') {
                return this.$t('call.inHangUpT')
              } else if (data.HANGUP_CAUSE === '3') {
                return this.$t('call.inHangUpT1')
              } else if (data.HANGUP_CAUSE === '21') {
                return this.$t('call.agent_hangup_type2')
              } else if (data.HANGUP_CAUSE === '16') {
                return this.$t('call.agent_hangup_type1')
              } else {
                return this.$t('call.agent_hangup_type4')
              }
            }
          } else if (data.HANGUP_USER === 'agent') {
            if (data.HANGUP_CAUSE) {
              if (data.HANGUP_CAUSE === '1') {
                return this.$t('call.inHangUpA') + '（' + this.$t('call.CauseOfHangingUp1') + '）'
              } else if (data.HANGUP_CAUSE === '2') {
                return this.$t('call.inHangUpA') + '（' + this.$t('call.CauseOfHangingUp2') + '）'
              } else if (data.HANGUP_CAUSE === '3') {
                if (data.LOOT_BY && data.LOOT_BY !== '') {
                  let agentObj = this.$store.getters.agents[data.LOOT_BY]
                  if (agentObj) {
                    return this.$t('call.inHangUpA') + '（' + this.$t('call.rootGua1') + agentObj.exten + '）'
                  }
                }
              } else if (data.HANGUP_CAUSE === '4') {
                if (data.FORCE_HANGUP_BY && data.FORCE_HANGUP_BY !== '') {
                  let agentObj = this.$store.getters.agents[data.FORCE_HANGUP_BY]
                  if (agentObj) {
                    return this.$t('call.inHangUpA') + '（' + this.$t('call.forceGua1') + agentObj.exten + '）'
                  }
                }
              } else if (data.HANGUP_CAUSE === '5') {
                return this.$t('call.inHangOutside')
              } else {
                return this.$t('call.inHangUpA') + '（' + this.$t('call.Activehangup') + '）'  
              }
            } else {
              return this.$t('call.inHangUpA') + '（' + this.$t('call.Activehangup') + '）'
            }
          } else if (data.HANGUP_USER === 'customer') {
            if (data.HANGUP_CAUSE && data.HANGUP_CAUSE === '1006') {
              return this.$t('call.inHangUpD')
            } else {
              return this.$t('call.inHangUpC')
            }
          } else if (data.HANGUP_USER === 'system') {
            if (data.HANGUP_CAUSE && data.HANGUP_CAUSE === '1006') {
              return this.$t('call.inHangUpD')
            }
          } else {
            return this.$t('call.inHangUpC')
          }
        } else {
          return this.$t('softPhoneBar.hangup')
        }
      }
    }
  }
</script>
<style lang="stylus" scoped>
  @import "../../../assets/common.styl"
  .ivr-ul .ui-time-line:before
    top 0
  .node-type
    color $c-email
    margin 0 10px
    display inline-block
    width 130px
    overflow hidden
    text-overflow ellipsis
    white-space nowrap
    vertical-align bottom
  .date
    margin 0 12px
    color $cf-gray4
    display inline-block
    width 12em
</style>
